<!--
 * @Descripttion: 
 * @version: 
 * @Author: QYFeng
 * @Date: 2021-05-15 19:12:46
 * @LastEditors: QYFeng
 * @LastEditTime: 2021-05-16 14:26:05
-->
<template>
  <div class="footer-wrap">
    <div class="center">
      <div class="head">热门频道</div>
      <div class="body">
        <router-link to="/channelDsj">电视剧</router-link>
        <router-link to="/channelDy">电影</router-link>
        <router-link to="/channelDm">动漫</router-link>
        <router-link to="/channelZy">综艺</router-link>
        <router-link to="/channelDp">短片</router-link>
        <router-link to="/channelJlp">纪录片</router-link>
        <router-link to="/starLibrary">明星库</router-link>
        <router-link to="/news">娱乐资讯</router-link>
      </div>
      <div class="foot">
        <p>
          友情链接：
          <a :href="configData.friend_url" target="_blank">{{
            configData.friend_url
          }}</a>
        </p>
        <p>
          公安备案：{{ configData.icp }} 工信部备案：{{ configData.public_icp }}
        </p>
        <p>明星库版权所有版权说明，版权与侵权举报</p>
      </div>
    </div>
    <el-backtop :bottom="100">
      <div class="top" style="">
        <i class="el-icon-caret-top"></i>
      </div>
    </el-backtop>
  </div>
</template>

<script>
export default {
  data() {
    return {
      configData: [],
    };
  },
  created() {
    this.$http.getConfig().then((res) => {
      if (res.data.code === 0) {
        this.configData = res.data.data;
      } else {
        this.$message.error("获取失败，请重试！");
      }
    });
  },
};
</script>

<style lang="scss" scoped>
.footer-wrap {
  width: 100%;
  height: 400px;
  background: #191a20;
  background-image: url("../assets/images/footer-bg.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  .center {
    width: 1600px;
    margin: 0 auto;
    color: #fff;
    font-family: PingFang SC;
    text-align: center;
    .head {
      font-size: 28px;
      font-weight: 400;
      line-height: 40px;
      padding-top: 102px;
    }
    .body {
      padding-top: 40px;
      a {
        font-size: 20px;
        font-weight: 400;
        line-height: 28px;
        color: #fff;
      }
      a:not(:first-child) {
        margin-left: 107px;
      }
    }
    .foot {
      padding-top: 62px;
      p,
      a {
        font-size: 18px;
        font-weight: 400;
        line-height: 25px;
        color: #fff;
      }
      :not(:first-child) {
        margin-top: 5px;
      }
    }
  }
}
.top {
  height: 40px;
  width: 40px;
  background-color: #f2f5f6;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.12);
  text-align: center;
  line-height: 40px;
  color: #ff8200;
  border-radius: 50%;
}
</style>